<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/imgs.css" />
	</head>

	<body>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript" src="js/zepto.min.js"></script>
		<script type="text/javascript" src="js/touch.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<script>
			mui.plusReady(function(){
				mui('#wraaper').on("tap","b",function(){
					mui.openWindow({
						url:'new.html',
						
					})

				})
			
			})
		</script>
		<div id="container">
			<img src="img/account_bg.jpg" alt="" />
			<div id="wraaper">
				<img src="https://staticfile.tujia.com/Mobile/Images/logo/tujia_logo_w1.png" alt="途家 tujia" width="135" height="32">
				
				<p id="btn">
					<span id="btn1">手机验证码登录</span><b>|</b>
					<span id="btn2">普通方式登录</span>
				</p>
				<div class="niu">
					<!--<div id="tel">
					<i class="mui-icon mui-icon-locked"></i>
					<input type="text" placeholder="手机号"/>
					<p class="btnn">点击获取验证码</p>
				</div>
				<div id="tell">
					<i class="mui-icon mui-icon-chatboxes"></i>
					<input type="text" placeholder="短信验证码"/>
				</div>-->
				</div>
				
				<button class="an">登录</button>
				<b class="new">新用户注册</b>
			</div>
		</div>
		<script>
			str='<div id="tel">'+
						'<i class="mui-icon mui-icon-locked"></i>'+
						'<input type="text" / placeholder="手机号">'+
						'<p class="btnn">点击获取验证码</p>'+
					'</div>'+
					'<div id="tell">'+
						'<i class="mui-icon mui-icon-chatboxes"></i>'+
						'<input type="text" / placeholder="短信验证码">'+

					'</div>';
					$('.niu').append(str);
			$('#btn').on('tap','span',function(e){
				e.preventDefault();
				$(this).css('color','#fff').siblings().css('color','#999');
//				console.log(e.target);
			$('.niu').html('');
				
				if(e.target.getAttribute('id')=='btn1'){
					str='<div id="tel">'+
						'<i class="mui-icon mui-icon-locked"></i>'+
						'<input type="text" / placeholder="手机号">'+
						'<p class="btnn">点击获取验证码</p>'+
					'</div>'+
					'<div id="tell">'+
						'<i class="mui-icon mui-icon-chatboxes"></i>'+
						'<input type="text" / placeholder="短信验证码">'+

					'</div>';
					$('.niu').append(str);
				}else{
					str='<div id="number">'+
						'<i class="mui-icon mui-icon-chatbubble"></i>'+
						'<input type="text" / placeholder="手机号/邮箱/用户名">'+
					'</div>'+
					'<div id="numbertel">'+
						
						'<i class="mui-icon mui-icon-chatbubble"></i>'+
						'<input type="text" / placeholder="登录密码">'+
						'<p class="ms">忘记密码？</p>'+
					'</div>';
					$('.niu').append(str);
				}
			})
		</script>
	</body>

</html>